	<template>
    <view>
        <!--搜索类型列表-->
        <view
            class="cate-mask mask" :style="isExpand ? 'margin-left: 168px;' : ''"
            :class="state === 0 ? 'none' : state === 1 ? 'show' : ''"
            @click="show"
        >
            <view class="cate-content">
                <scroll-view scroll-y class="list">
                    <view v-for="item in list" :key="item.code">
                        <view
                            class="item"
                            :class="{ active: item.code == curCode }"
                            @click="change(item)"
                            >{{ item.name }}</view
                        >
                    </view>
                </scroll-view>
            </view>
        </view>
    </view>
</template>

<script>
import searcher from "../../js/search/Searcher.js";
import { mapGetters } from 'vuex';
export default {
	computed: {
		...mapGetters(['isExpand'])
	},
    props: ["type"],
    data() {
        return {
            state: 0,
            list: [],
            curCode: "",
            curItem: null,
        };
    },

    methods: {
        //显示分类面板
        init() {
            console.log("this.type====:", this.type);
            this.list = [];
            if (this.type == 1)
                //产品
                this.list = searcher.getGdsObjTypeList();
            else if (this.type == 2)
                //单据
                this.list = searcher.getBillSearObjTypeList();
            else if (this.type == 3)
                // 客户
                this.list = searcher.getCoutomTypeList();
            else if (this.type == 4)
                //供应商
                this.list = searcher.getSuppTypeList();
            else if (this.type == 5)
                //服务
                this.list = searcher.getProjectTypeList();
            else if (this.type == 6)
                this.list = [
                    {
                        name: "客户",
                        code: "1",
                    },
                    {
                        name: "服务",
                        code: "2",
                    },
                ];

            if (!this.list || !this.list.length) return;
            if (this.curCode == "" || this.curItem == null) {
                let item = this.list[0];
                this.curItem = item;
                this.curCode = item.code;
                this.$emit("setDefaultObjType", this.curItem);
            }
        },

        setCurCodeNull() {
            this.curCode = "";
            this.curItem = null;
        },

        show(type) {
            this.init();
            let timer = type === "show" ? 10 : 200;
            let state = type === "show" ? 1 : 0;
            this.state = 2;
            setTimeout(() => {
                this.state = state;
            }, timer);

            if (type != "show") {
                this.$emit("showAndHideTypeList", false);
                return;
            }
            this.$emit("showAndHideTypeList", true);
        },

        /****切换***/
        change(item) {
            this.curItem = item;
            this.curCode = item.code;
            this.$emit("changeObjType", item);
        },
    },
};
</script>
<style lang="scss">
.mask {
    // margin-top: 20px;
    top: 55px;
    z-index: 9999;
}
.list {
    max-height: 480px;
    view {
        padding-left: 10px;
        line-height: 30px;
        font-size: 15px;
        cursor: pointer;
    }
    view:hover {
        background-color: #ddd;
    }
}
.active {
    color: #007aff;
}
</style>